<!doctype html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">


    <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="../bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="../css/iconfont.css">
    <link rel="stylesheet" href="../css/integratio.css">

    <title>Tracking Time Software - integrations with TimeCamp</title>
</head>

<body>
    <header class="position-fixed">
        <div class="container">
            <nav class="navbar navbar-expand-lg navbar-light">
                <a class="navbar-brand" href="../index.html">
                    <img src="../images/sign.png" alt="" width="140px">
                </a>
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText"
                    aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarText">
                    <ul class="navbar-nav mr-auto font-weight-light text-center">
                        <li class="nav-item">
                            <a class="nav-link" href="#">Features</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="./pricing.html">Pricing</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link active" href="./integration.html">Integrations</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">Remote work</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">Book a Demo</a>
                        </li>
                        <li class="nav-item d-block d-lg-none">
                            <a class="nav-link" href="./register.html">Sign Up for Free</a>
                        </li>
                        <li class="nav-item d-block d-lg-none">
                            <a class="nav-link" href="./login.html">Log in</a>
                        </li>
                    </ul>
                    <form class="form-inline d-none d-lg-block">
                        <a href="./register.html"><button class="btn btn-outline-success btn-signUp mr-2" type="button">Sign Up for
                                Free</button></a>
                        <a href="./login.html"><button class="btn btn-outline-success btn-logIn" type="button">Log in</button></a>
                    </form>
                </div>
            </nav>

        </div>
    </header>
    <section id="ad-ons" class="container font-weight-light">
        <p class="home-link ml-5 mb-5 "><a href="../index.html"
                class="text-decoration-none">Home</a>&nbsp;&nbsp;&nbsp;/&nbsp;&nbsp;&nbsp; Integrations</p>
        <h2 class="text-center font-weight-light">Add-ons and Apps</h2>
        <p class="text-center second-txt">Seamless Integration with Project Management Software</p>
        <p class="text-left third-txt mt-4"><em><span>"Timecamp has become an essential part of my work flow. I am very
                    happy
                    to
                    be able to track time in this way as</span> <span class="font-weight-bolder"> I have tried many,
                    many
                    tools and integrations and this is the simplest and easiest to use."</span></em>
        </p>
    </section>
    <section id="soft" class="container">
        <ul class="list-unstyled mt-5 pt-5 row">
            <!-- <li class="col-12 col-sm-6 col-md-4">
                <div class="media">
                    <img src="../images/soft01.png" class="mr-3" alt="...">
                    <a href="#" class="text-decoration-none">
                        <div class="media-body">
                            <h5 class="mt-0">TimeCamp for iPhone</h5>
                            <p class=" font-weight-light">Official app for iPhone. Get on App Store.</p> 
                        </div>
                    </a>

                </div>
            </li> -->
        </ul>
    </section>
    <footer>
        <div class="skew-bg"></div>
        <div class="bg pb-4">
            <div class="container">
                <div class="row top">
                </div>
                <i class="d-block mt-3 mb-5"></i>
                <ul class="row list-unstyled middle">
                    <li class="col-sm-3 col-12 text-center text-sm-left">
                        <a href="#">Terms</a>
                    </li>
                    <li class="col-sm-3 col-12 text-center text-sm-left">
                        <a href="#">Privacy</a>
                    </li>
                    <li class="col-sm-3 col-12 text-center text-sm-left">
                        <a href="#">Security</a>
                    </li>
                </ul>
                <ol class="list-unstyled row bottom">
                    <li class="col-sm-3 col-12 text-center text-sm-left">TimeCamp. Inc. 340 S Lemon Ave #4967, Walnut CA
                        91789
                        We use cookies.
                        <a href="#" class="font-weight-bold">Click here for more</a>
                    </li>
                    <li class="col-sm-3 col-12 text-center text-sm-left">United States, support@timecamp.com</li>
                    <li class="col-sm-3 col-12 text-center text-sm-left">Copyright © 2020 TimeCamp. Inc.</li>
                    <li class="col-sm-3 col-12 text-center text-sm-right">
                        <div class="dropup">
                            <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu2"
                                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                <span class="iconfont icon-diqiu"></span>
                                English
                            </button>
                            <div class="dropdown-menu" aria-labelledby="dropdownMenu2">
                                <button class="dropdown-item" type="button">German</button>
                                <button class="dropdown-item" type="button">French</button>
                                <button class="dropdown-item" type="button">Polish</button>
                                <button class="dropdown-item" type="button">Spanish</button>
                                <button class="dropdown-item" type="button">Portugese</button>
                                <button class="dropdown-item" type="button">Russian</button>
                                <button class="dropdown-item" type="button">Italiano</button>
                                <button class="dropdown-item" type="button">Chinese</button>
                                <button class="dropdown-item" type="button">Arabic</button>
                            </div>
                        </div>
                    </li>
                </ol>
            </div>

        </div>
        <div class="server position-fixed rounded-circle shadow-lg rounded">
            <p>
                <span class="rounded-circle circle1"></span>
                <span class="rounded-circle circle2"></span>
                <span class="rounded-circle circle3"></span>
            </p>
        </div>
        <div class="dialog position-fixed shadow-lg">
            <div class="header pt-2 pl-2 pr-2">
                <p class="d-flex justify-content-between align-items-center top">
                    <span class="left" data-toggle="tooltip" data-placement="bottom" title="Options">
                        <i></i>
                        <i></i>
                        <i></i>
                    </span>
                    <span class="font-weight-bold">Now chatting</span>
                    <span class="closes" id="closes" data-toggle="tooltip" data-placement="bottom" title="Minimize window">
                        <i></i>
                    </span>
                </p>
                <div class="bot d-flex align-content-center justify-content-between">
                    <div class="media">
                        <img src="../images/server.jfif" class="mr-2 rounded-circle" alt="..." width="20%">
                        <div class="media-body">
                            <p class="mb-0 font-weight-bold">Sammy Brand</p>
                            Support Agent
                        </div>
                    </div>
                    <p class="d-inline-block">
                        <span class="iconfont icon-zan" data-toggle="tooltip" data-placement="bottom"
                            title="Rate as good"></span>
                        <span class="iconfont icon-buzan zan" data-toggle="tooltip" data-placement="bottom"
                            title="Rate as bad"></span>
                    </p>
                </div>
            </div>
            <ul class="middle-con p-2">
                <li class="media">
                    <p class="head"></p>
                    <div class="media-body">
                        <span class="mt-0">Sammy Brand</span>
                        <span>19:55</span>
                        <p class="bg-white">Hi - can I answer any questions for you?</p>
                    </div>
                </li>
                <!-- <li class="you text-right">
                            <p class="tip mb-0">You
                                <span class="d-inline-block">21:33</span>
                            </p>
                            <p class="mb-0 content">hello</p>
                            <span class="active d-block">Read</span>
                        </li> -->
            </ul>
            <div class="bottom pl-3 pr-3">
                <input type="text" id="send-msg" class="border-0" placeholder="Write a message">
                <svg class="icon" id="send" aria-hidden="true">
                    <use xlink:href="#icon-fasong-mian-" style="fill:red"></use>
                </svg>
            </div>
        </div>
    </footer>


    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="../js/jquery-3.5.1.min.js"></script>
    <script src="../js/popper.min.js"></script>
    <script src="../bootstrap/js/bootstrap.js"></script>
    <script src="../js/iconfont.js"></script>
    <script src="../js/myJs/integration.js"></script>
</body>

</html>